<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
</head>
<body>
    <div style="text-align: center;">
        <h1>登录</h1>
        用户：<input id="username">
        <br>
        密码：<input id="password" type="password">
        <br>
        <input type="button" value=" 提交 " onclick="mysub()" style="margin-top: 20px;margin-left: 50px;">
    </div>
</body>
</html>
<script>
    function mysub(){
        let username = jQuery("#username");
        let password = jQuery("#password");
        if (jQuery.trim(username.val())==""){
            alert("请先输入用户名!");
            username.focus();
            return;
        }
        if (jQuery.trim(password.val())==""){   
            alert("请输入密码!");
            password.focus();
            return;
        }
        //JSON.stringify用于返回一个JSON字符串
        jQuery.ajax({
            url: "/user/login3",
            type: "POST",
            contentType: "application/json",
            data: JSON.stringify({"username":username.val(),
                   "password":password.val()}),
            success:function(result){
                alert(JSON.stringify(result));
            }
        });

        // 不返回JSON,用参数返回的写法
        // jQuery.ajax({
        //     url: "/user/login3",
        //     type: "POST",
        //     data: {"username":username.val(),
        //            "password":password.val()},
        //     success:function(result){
        //         alert(JSON.stringify(result));
        //     }
        // });
    }
</script>